<template>
  <div>
    <p>{{ count }}</p>
    <!-- <button @click="getstore">点击修改</button> -->
    <button @click="sun">点击修改</button>
    <button @click="opengetters">修改getters||获取getters</button>
    <button @click="updataActions">接口Actions</button>
    <button @click="getdata">获取actions</button>
  
  
  </div>
</template>

<script>


import { mapState, mapMutations } from "vuex";
export default {
  name: "page5",
  data() {
    return {
      name: "",
      obj: {
        num: 1,
        age: 18,
      },
    };
  },
  computed: {
    count() {
      //拿出state的count方法1
      return this.$store.state.count;
    },
    // ...mapState(["count"]), //拿出state的count方法2
  },
  methods: {
    ...mapMutations(["sum"]), //方法2操作mutations sum
    sun() {
      this.sum(this.obj);
    },

    getdata() {
      //拿出state的data方法3
      let data = this.$store.state.data;
      console.log(data);
    },
    // getstore() { //方法1操作mutations
    // var num=1,age='18'
    // this.$store.commit('sum',{num,age}); //操作state 多个参数要用对象方式传入
    // },

    // 获取getters
    opengetters() {
      let obj = {
        name: "lizai",
        age: 152,
      };
      let uptersdata = this.$store.getters.upMyinfo(obj); //修改
      console.log(uptersdata);
      let gettersdata = this.$store.getters.getMyinfo; //取出
      console.log(gettersdata);
    },

    // 异步actions
    updataActions() {
      let api = {
        topice: "/topics",
        topiceDetaile: "topic/5433d5e4e737cbe96dcef312",
      };
      this.$store.dispatch("setNodelist", api);
    },
  },

  created() {},
  mounted() {},
};
</script>

<style>
</style>